<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>元素的隐藏</title>

        <style>
            .box1 {
                width: 200px;
                height: 200px;
                background-color: red;
            }
            .box2 {
                width: 200px;
                height: 200px;
                background-color: yellow;
                /* 隐藏，彻底放弃了位置 */
                /*display: none; */
                /* 隐藏，不放弃位置 */
                visibility: hidden;
            }
            .box3 {
                width: 200px;
                height: 200px;
                background-color: blue;
            }
        </style>
    </head>
    <body>
       <div class="box1"></div> 
       <div class="box2"></div>
       <div class="box3"></div>
    </body>
</html>